/*
 * @Author: luojian jian.luo@macrowing.com
 * @Date: 2024-05-15 15:57:51
 * @LastEditors: luojian jian.luo@macrowing.com
 * @LastEditTime: 2024-05-22 09:24:31
 * @FilePath: \JiangHeBiWeb\src\components\jh\EdrmsType\index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React, { useState, useEffect, useRef } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { EdrmsTypeStyle } from './style';
import * as echarts from 'echarts/core';
import EdrmsTypePie from './EdrmsTypePie';
import EdrmsTypeRankItem from './EdrmsTypeRank';
import { RootState } from '@/store';
import { MainState } from '@/store/reducers/main';
import { EdrmsTypeDto } from '@/services/types';
import { getEdrmsTypeList } from '@/services';
type EdrmsTypePropsType = {

};
const BorrowCount = () => {
    const fondName = useSelector((state: any) => state.mutifonds.fondName);
    // const { edrmsTypeDto } = useSelector<RootState, MainState>((state) => {
    //     return state.main
    // });
    const [edrmsTypeData, setEdrmsTypeData] = useState<EdrmsTypeDto>({});

    useEffect(() => {
        getEdrmsTypeList().then(res => {  
            // const  a={
            //     "total": 12,
            //     "edrmsTypeData": [
            //         {
            //             "sort": 1,
            //             "name": "文书档案（件）",
            //             "number": 9,
            //             "perCentNumber": 75
            //         },
            //         {
            //             "sort": 2,
            //             "name": "合同档案",
            //             "number": 3,
            //             "perCentNumber": 25
            //         }
            //         ,
            //         {
            //             "sort": 2,
            //             "name": "科技档案",
            //             "number": 3,
            //             "perCentNumber": 25
            //         }
            //         ,
            //         {
            //             "sort": 2,
            //             "name": "会计档案",
            //             "number": 3,
            //             "perCentNumber": 25
            //         }
            //         ,
            //         {
            //             "sort": 2,
            //             "name": "实物档案",
            //             "number": 3,
            //             "perCentNumber": 25
            //         }
            //     ]
            // }
            setEdrmsTypeData(res);
        });

    }, [fondName]);

    useEffect(() => {

    }, [edrmsTypeData]);

    return (
        <EdrmsTypeStyle>
            <div className="edrmstype" style={{ "display": "flex" }}>
                <div style={{ "width": "50%" }}>
                    <EdrmsTypePie data={edrmsTypeData || {}}></EdrmsTypePie>
                </div>
                <EdrmsTypeRankItem data={edrmsTypeData || {}}></EdrmsTypeRankItem>
            </div>
        </EdrmsTypeStyle>
    );
};

export default BorrowCount;
